<template>
    <div class="NumbeRFMaintenMZZJJZ">
        <div class="pubBig standard ">
            <div class="h0">
                <p class="lt">医院收入与医保统筹分析</p>
            </div>
            <el-row class="selectTime" style="padding: 6px">

                <el-col :span="5">
                    <span>机构：</span>
                    <el-tooltip :disabled="disabledTooltip" style="width: 180px!important;" effect="dark"
                                :content="selectZZJGNames" placement="top">

                        <el-select v-model="selectZZJGNames" placeholder="请选择机构"
                                   style="width: 180px;text-overflow: ellipsis;"
                                   show-overflow-tooltip ref="selectReport">
                            <el-option style="width: 380px;height:200px;overflow: auto;background-color:#fff">
                                <el-tree
                                        :data="ZZJGList"
                                        :check-strictly="true"
                                        :props="defaultProps"

                                        node-key="id"
                                        @node-click="handleNodeClick"

                                ></el-tree>
                                <el-tree
                                        v-if="false"
                                        :data="ZZJGList"
                                        show-checkbox
                                        node-key="id"
                                        ref="treeJG"
                                        :props="defaultProps"
                                        @check="handleCheck"
                                        default-expand-all
                                        :check-strictly="true"
                                        :expand-on-click-node="false">
      <span class="custom-tree-node" slot-scope="{ node, data }">
        <span v-if="false">{{ node.label }}</span>
          <el-dropdown @command="handleCommand">
             <span class="el-dropdown-link">
                  {{ node.label }}<i class="el-icon-arrow-down el-icon--right"></i>
              </span>
             <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item :command="beforeHandleCommand(0, data,'本机构')">本机构</el-dropdown-item>
                  <el-dropdown-item :command="beforeHandleCommand(0, data,'本机构及下属机构')">本机构及下属机构</el-dropdown-item>
            </el-dropdown-menu>
        </el-dropdown>
      </span>
                                </el-tree>
                            </el-option>
                        </el-select>
                    </el-tooltip>
                </el-col>
                <el-col :span="2">
                    <Button type="primary" icon="ios-search" @click="setSelectQK">清空</Button>
                </el-col>
                <el-col :span="4">
                    <el-date-picker type="date" placeholder="Select date" @change="getDataList()" style="width: 200px"
                                    v-model="queryDataObj.BeginDate"
                                    value-format="yyyy-MM-dd"
                    ></el-date-picker>
                </el-col>
                <el-col :span="1" style="color: #348EED;font-size: 16px;text-align:center;padding: 6px">至</el-col>
                <el-col :span="4">
                    <el-date-picker type="date" placeholder="Select date" @change="getDataList()" style="width: 200px"
                                    v-model="queryDataObj.EndDate"
                                    value-format="yyyy-MM-dd"
                    ></el-date-picker>
                </el-col>

                <el-col :span="4" v-if="false">
                    <label>范围:</label>
                    <select class="form-control"
                            v-model="queryDataObj.selectFW"
                            style="width: 120px!important;"
                            placeholder="请选择">
                        <option v-for="(item,index) in FWList"
                                :label="item.name"
                                :value="item.id" :key="index">
                        </option>
                    </select>
                </el-col>

                <el-col :span="2">
                    <Button type="primary" @click="getDataList()" icon="ios-search">搜索</Button>
                </el-col>
                <el-col :span="2">
                    <Button type="primary" @click="output()" icon="ios-search">导出</Button>
                </el-col>
            </el-row>
            <div ref="tableV"
                 style="width: 100%; margin-bottom: 20px; position: fixed;bottom: 10px;top: 90px;overflow: auto;">
<!--                  default-expand-all-->
                <el-table
                        :data="tableDataList"
                        style="width: 100%;margin-bottom: 20px;"
                        :height="tableHeight"
                        row-key="id"
                        id="Excel1"
                        border
                        :summary-method="getSummaries"
                        show-summary

                        :tree-props="{children: 'childs', hasChildren: 'hasChildren'}">
                    <el-table-column
                            label="机构名称"
                            sortable
                            width="210">
                        <template slot-scope="scope">
                            {{ scope.row.name }}
                        </template>
                    </el-table-column>
                    <el-table-column label="全部">
                        <el-table-column
                                prop="CashPay"
                                width="80"
                                label="医保自付">
                        </el-table-column>
                        <el-table-column
                                prop="CardPay"
                                width="80"
                                label="账户支付">
                        </el-table-column>
                        <el-table-column
                                width="80"
                                label="统筹支付">
                            <template slot-scope="scope">
                                <a style="font-size: 10px;color: blue" v-if="false"
                                   @click="showTCMX(scope.row)">{{scope.row.SIPay}}</a>
                                {{scope.row.SIPay}}
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="Cost"
                                label="收入合计"
                                width="80"
                        >
                        </el-table-column>
                        <el-table-column
                                prop="VisitSum"
                                label="人次"
                                width="80"
                        >
                        </el-table-column>
                        <el-table-column
                                prop="Percent"
                                label="占比"
                                width="80"
                        >
                        </el-table-column>

                    </el-table-column>
                    <el-table-column label="门诊相关">
                        <el-table-column
                                prop="CashPayMZ"
                                width="80"
                                label="医保自付">
                        </el-table-column>
                        <el-table-column
                                prop="CardPayMZ"
                                width="80"
                                label="账户支付">
                        </el-table-column>
                        <el-table-column
                                width="80"
                                label="统筹支付">
                            <template slot-scope="scope">
                                <a style="font-size: 10px;color: blue"
                                   @click="showTCMX('门诊',scope.row)">{{scope.row.SIPayMZ}}</a>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="CostMZ"
                                label="收入合计"
                                width="80"
                        >
                        </el-table-column>
                        <el-table-column
                                prop="VisitSumMZ"
                                label="人次"
                                width="80"
                        >
                        </el-table-column>
                        <el-table-column
                                prop="PercentMZ"
                                label="占比"
                                width="80"
                        >
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="住院相关">
                        <el-table-column
                                prop="CashPayZY"
                                width="80"
                                label="医保自付">
                        </el-table-column>
                        <el-table-column
                                prop="CardPayZY"
                                width="80"
                                label="账户支付">
                        </el-table-column>
                        <el-table-column
                                width="80"
                                label="统筹支付">
                            <template slot-scope="scope">
                                <a style="font-size: 10px;color: blue"
                                   @click="showTCMX('住院',scope.row)">{{scope.row.SIPayZY}}</a>
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="CostZY"
                                label="收入合计"
                                width="80"
                        >
                        </el-table-column>
                        <el-table-column
                                prop="VisitSumZY"
                                label="人次"
                                width="80"
                        >
                        </el-table-column>
                        <el-table-column
                                prop="PercentZY"
                                label="占比"
                                width="80"
                        >
                        </el-table-column>
                    </el-table-column>
                </el-table>
            </div>
        </div>
        <!--弹框：明细钻取弹框-->
        <div class="blackBg Template" v-if="MXTK== true">
            <div class="panel-default">
                <em class="closes" @click="MXTK=false">×</em>
                <div class="panel-heading">统筹明细</div>
                <div class="yiJi">
                    <div class="Report">
                        <div class="importBox">
                            <div class="Tb2" style="padding: 4px;">
                                <div style="height:auto;">
                                    <el-table
                                            :data="tableDataListMX"
                                            style="width: 100%;margin-bottom: 20px;"
                                            row-key="id"
                                            id="Excel1"
                                            border
                                            height="510px"
                                            default-expand-all
                                    >
                                        <el-table-column
                                                prop="CBD"
                                                label="参保地"
                                                sortable
                                                width="120">
                                        </el-table-column>
                                        <el-table-column
                                                prop="SiType"
                                                label="医保类型"
                                                sortable
                                                width="110">
                                        </el-table-column>

                                        <el-table-column
                                                prop="RYSX"
                                                label="医保人员属性">
                                        </el-table-column>
                                        <el-table-column
                                                prop="YLLB"
                                                label="医疗类别">
                                        </el-table-column>
                                        <el-table-column
                                                prop="Name"
                                                label="病人姓名">
                                        </el-table-column>

                                        <el-table-column
                                                prop="YBKH"
                                                label="医保号">
                                        </el-table-column>
                                        <el-table-column
                                                prop="SFZH"
                                                label="医保卡号">
                                        </el-table-column>

                                        <el-table-column
                                                prop="JBMC"
                                                label="疾病名称">
                                        </el-table-column>
                                        <el-table-column
                                                prop="DWMC"
                                                label="单位">
                                        </el-table-column>
                                        <el-table-column
                                                prop="ZHYE"
                                                label="账户余额">
                                        </el-table-column>

                                        <el-table-column
                                                prop="Cost"
                                                label="费用合计">
                                        </el-table-column>


                                        <el-table-column
                                                prop="SIPay"
                                                label="统筹支付">
                                        </el-table-column>
                                        <el-table-column
                                                prop="CardPay"
                                                label="账户支付">
                                        </el-table-column>
                                        <el-table-column
                                                prop="CashPay"
                                                label="现金支付">
                                        </el-table-column>
                                        <el-table-column
                                                prop="DBLP"
                                                label="大病理赔">
                                        </el-table-column>
                                        <el-table-column
                                                prop="ZGBZ"
                                                label="照顾补助">
                                        </el-table-column>
                                        <el-table-column
                                                prop="GWYBZ"
                                                label="公务员补助">
                                        </el-table-column>
                                        <el-table-column
                                                prop="YYZF"
                                                label="医院支付">
                                        </el-table-column>
                                        <el-table-column
                                                prop="YLJZ"
                                                label="医疗救助">
                                        </el-table-column>
                                        <el-table-column
                                                prop="QFXSY"
                                                label="起付线">
                                        </el-table-column>
                                        <el-table-column
                                                prop="XFQZHYE"
                                                label="剩余起付线">
                                        </el-table-column>

                                        <el-table-column v-if="false"
                                                prop="Cost"
                                                label="发票操作员">
                                        </el-table-column>
                                        <el-table-column
                                                prop="PJH"
                                                label="发票号">
                                        </el-table-column>
                                    </el-table>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--弹框：明细钻取弹框-->
        <div class="blackBg Template" v-if="MXTKZY== true">
            <div class="panel-default">
                <em class="closes" @click="MXTKZY=false">×</em>
                <div class="panel-heading">住院统筹明细</div>
                <div class="yiJi">
                    <div class="Report">
                        <div class="importBox">
                            <div class="Tb2" style="padding: 4px;">
                                <div style="height:auto;">
                                    <el-table
                                            :data="tableDataListMX"
                                            style="width: 100%;margin-bottom: 20px;"
                                            row-key="id"
                                            id="Excel1"
                                            border
                                            height="510px"
                                            default-expand-all
                                    >
                                        <el-table-column
                                                prop="CBD"
                                                label="参保地"
                                                sortable
                                                width="120">
                                        </el-table-column>
                                        <el-table-column
                                                prop="SiType "
                                                label="医保类型"
                                                sortable
                                                width="110">
                                        </el-table-column>

                                        <el-table-column
                                                prop="RYSX"
                                                label="医保人员属性">
                                        </el-table-column>
                                        <el-table-column
                                                prop="YLLB"
                                                label="医疗类别">
                                        </el-table-column>
                                        <el-table-column
                                                prop="Name"
                                                label="病人姓名">
                                        </el-table-column>

                                        <el-table-column
                                                prop="YBKH"
                                                label="医保号">
                                        </el-table-column>
                                        <el-table-column
                                                prop="SFZH"
                                                label="医保卡号">
                                        </el-table-column>

                                        <el-table-column
                                                prop="CreateDate"
                                                label="出院时间">
                                        </el-table-column>
                                        <el-table-column
                                                prop="InDiagCode"
                                                label="入院诊断编码">
                                        </el-table-column>
                                        <el-table-column
                                                prop="InDiagName"
                                                label="入院诊断">
                                        </el-table-column>

                                        <el-table-column
                                                prop="OutDiagCode"
                                                label="出院诊断编码">
                                        </el-table-column>
                                        <el-table-column
                                                prop="OutDiagName"
                                                label="出院诊断">
                                        </el-table-column>

                                        <el-table-column
                                                prop="DWMC"
                                                label="单位">
                                        </el-table-column>
                                        <el-table-column
                                                prop="ZHYE"
                                                label="账户余额">
                                        </el-table-column>

                                        <el-table-column
                                                prop="Cost"
                                                label="费用合计">
                                        </el-table-column>


                                        <el-table-column
                                                prop="SIPay"
                                                label="统筹支付">
                                        </el-table-column>
                                        <el-table-column
                                                prop="CardPay"
                                                label="账户支付">
                                        </el-table-column>
                                        <el-table-column
                                                prop="CashPay"
                                                label="现金支付">
                                        </el-table-column>
                                        <el-table-column
                                                prop="DBLP"
                                                label="大病理赔">
                                        </el-table-column>
                                        <el-table-column
                                                prop="ZGBZ"
                                                label="照顾补助">
                                        </el-table-column>
                                        <el-table-column
                                                prop="GWYBZ"
                                                label="公务员补助">
                                        </el-table-column>
                                        <el-table-column
                                                prop="YYZF"
                                                label="医院支付">
                                        </el-table-column>
                                        <el-table-column
                                                prop="YLJZ"
                                                label="医疗救助">
                                        </el-table-column>
                                        <el-table-column
                                                prop="QFXSY"
                                                label="起付线">
                                        </el-table-column>
                                        <el-table-column
                                                prop="XFQZHYE"
                                                label="剩余起付线">
                                        </el-table-column>

                                        <el-table-column v-if="false"
                                                         prop="Cost"
                                                         label="发票操作员">
                                        </el-table-column>
                                        <el-table-column
                                                prop="PJH"
                                                label="发票号">
                                        </el-table-column>
                                    </el-table>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    import echarts from 'echarts'
    import FileSaver from "file-saver"
    import XLSX from "xlsx"

    export default {
        name: "Bedinformation",
        data() {
            return {//定义全局变量
                barData: {
                    Mon: 13253,
                    Tue: 34235,
                    Wed: 26321,
                    Thu: 12340,
                    Fri: 24643,
                    Sat: 1322,
                    Sun: 1324
                },
                selectZZJG: {
                    name: ""
                },
                selectZZJGNames: "",
                selectZZJGIDList: [],
                ZZJGList: [],
                defaultProps: {
                    children: 'childs',
                    label: 'name'
                },
                disabledTooltip: true,
                queryDataObj: {
                    BeginDate: "",
                    EndDate: "",
                    Hospitals: [],
                    selectFW: "0"
                },

                /****************收入结构*********************/
                srjgKeys: [],
                srjgValues: [],
                /****************病人费用统计*********************/
                BRFYtimeList: [],//时间轴
                BRFYmzDate: [],//门诊费用数据
                BRFYzyDate: [],//住院费用数据
                /****************月收入统计*********************/
                YSRtimeList: [],//时间轴
                YSRypDate: [],//药品费用数据
                YSRzlDate: [],//诊疗费用数据
                /******************机构财务树结构************************/
                tableData: [],
                tableData22: [],
                tableDataList: [],
                FWList: [
                    {
                        name: "全部",
                        id: "0",
                    },
                    {
                        name: "门诊",
                        id: "1",
                    },
                    {
                        name: "住院",
                        id: "2",
                    }
                ],
                /******************************************/
                tableHeight: 550,
                MXTK: false,
                MXTKZY:false,
                tableDataListMX:[],
            }
        },
        methods: {
            showTCMX(type,row) {
                if(type=="门诊"){
                    this.MXTK = true;
                }
                if(type=="住院"){
                    this.MXTKZY = true;
                }

                this.getDataListItem(type,row.HospitalId)
            },
            setTableHeight() {
                console.log('高度改变*******&&&&&&&&')
                // console.log(this.$refs.table)
                // console.log(this.$refs.table.$el.offsetTop)
                console.log(this.$refs.tableV)
                // console.log(this.$refs.tableV.offsetHeight)
                // console.log(this.$refs.tableV.$el.height)
                // this.tableHeight = window.innerHeight - this.$refs.table.$el.offsetTop - 115
                this.tableHeight = this.$refs.tableV.offsetHeight - 8
                console.log('this.tableHeight')
                console.log(this.tableHeight)
            },
            output() {
                var wb = XLSX.utils.table_to_book(document.querySelector("#Excel1"));//mytable为表格的id名
                /* get binary string as output */
                var wbout = XLSX.write(wb, {
                    bookType: "xlsx",
                    bookSST: true,
                    type: "array"
                });
                try {
                    FileSaver.saveAs(
                        new Blob([wbout], {type: "application/octet-stream"}),
                        "财务概况.xlsx"//导出的表名
                    );
                } catch (e) {
                    if (typeof console !== "undefined") console.log(e, wbout);
                }
                return wbout;
            },
            showTooltip() {
                console.log("数据111111111122222")
                const lifeW = this.selectZZJGNames;
                console.log(lifeW)
                console.log(lifeW.length)
                this.disabledTooltip = lifeW.length < 20
                console.log(this.disabledTooltip)
            },
            beforeHandleCommand(index, row, command) {
                return {
                    'index': index,
                    'row': row,
                    'command': command
                }
            },
            handleCommand(command) {
                switch (command.command) {
                    case "本机构"://本机构
                        console.log("本机构@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@");
                        console.log(command.row)
                        this.selectBJG(command.row)
                        break;
                    case "本机构及下属机构"://本机构及下属机构
                        this.selectAllJG(command.row)
                        break;

                }
            },
            setSelectQK() {
                this.selectZZJGNames = "";
                this.selectZZJGIDList = []
                this.$refs.treeJG.setCheckedKeys([]);
            },
            selectBJG(data) {
                console.log("选中本机构")
                console.log(data)
                this.selectZZJGNames = "";
                this.selectZZJGIDList = []
                var isCZ = false
                this.selectZZJGIDList.forEach(m => {
                    if (m.id == data.id) {
                        isCZ = true
                    }
                })
                if (isCZ == false) {
                    var obj = {
                        id: data.id,
                        name: data.name
                    }
                    this.selectZZJGIDList.push(obj)
                    var keys = [];
                    this.selectZZJGNames = ""
                    this.selectZZJGIDList.forEach(m => {
                        keys.push(m.id)
                        this.selectZZJGNames += m.name + ","
                    })
                    console.log("选中机构打勾")
                    this.$refs.treeJG.setCheckedKeys(keys);
                }
            },
            selectAllJG(data) {
                console.log("选中本机构")
                console.log(data)
                this.selectZZJGNames = "";
                this.selectZZJGIDList = []
                var isCZ = false
                this.selectZZJGIDList.forEach(m => {
                    if (m.id == data.id) {
                        isCZ = true
                    }
                })
                if (isCZ == false) {
                    var obj = {
                        id: data.id,
                        name: data.name
                    }
                    this.selectZZJGIDList.push(obj)
                }
                data.childs.forEach(m => {
                    var isCZ2 = false
                    this.selectZZJGIDList.forEach(n => {
                        if (m.id == n.id) {
                            isCZ2 = true
                        }
                    })
                    if (isCZ2 == false) {
                        var obj = {
                            id: m.id,
                            name: m.name
                        }
                        this.selectZZJGIDList.push(obj)
                    }

                    if (m.childs.length > 0) {
                        m.childs.forEach(m1 => {
                            var isCZ21 = false
                            this.selectZZJGIDList.forEach(n => {
                                if (m1.id == n.id) {
                                    isCZ21 = true
                                }
                            })
                            if (isCZ21 == false) {
                                var obj = {
                                    id: m1.id,
                                    name: m1.name
                                }
                                this.selectZZJGIDList.push(obj)
                            }

                            if (m1.childs.length > 0) {
                                if (m1.childs.length > 0) {
                                    m1.childs.forEach(m11 => {
                                        var isCZ211 = false
                                        this.selectZZJGIDList.forEach(n => {
                                            if (m11.id == n.id) {
                                                isCZ211 = true
                                            }
                                        })
                                        if (isCZ211 == false) {
                                            var obj = {
                                                id: m11.id,
                                                name: m11.name
                                            }
                                            this.selectZZJGIDList.push(obj)
                                        }

                                        if (m11.childs.length > 0) {

                                        }
                                    })
                                }
                            }
                        })
                    }
                })


                var keys = [];
                this.selectZZJGNames = ""
                this.selectZZJGIDList.forEach(m => {
                    keys.push(m.id)
                    this.selectZZJGNames += m.name + ","
                })
                console.log("选中机构打勾")
                this.$refs.treeJG.setCheckedKeys(keys);


            },
            handleNodeClick(data) {
                console.log("选中机构及￥￥￥￥￥￥￥￥￥￥￥￥￥￥￥￥");
                console.log(data);
                this.$refs.selectReport.blur()
                // this.selectZZJG=data;
                this.selectZZJGNames = data.name
                this.selectZZJGIDList = []
                var obj = {
                    id: data.id
                }
                this.selectZZJGIDList.push(obj)

                this.tableData = [];
                this.tableData.push(data)
                console.log("打印this.tableData");
                console.log(this.tableData);
            },
            handleCheck(checkedNodes, checkedKeys) {
                console.log("选中机构节点1")
                console.log(checkedNodes)
                console.log("选中机构节点2")
                console.log(checkedKeys)
                console.log(checkedKeys.checkedNodes)

                this.selectZZJGNames = "";
                this.selectZZJGIDList = []
                checkedKeys.checkedNodes.forEach(m => {
                    var obj = {
                        id: m.id,
                        name: m.name
                    }
                    this.selectZZJGIDList.push(obj)
                    this.selectZZJGNames += m.name + ","
                })


            },
            handleCheckChange(data, checked, indeterminate) {
                // console.log("选中机构节点1")
                //  console.log(data)
                //  console.log("选中机构节点2")
                //  console.log(checked)
                //  console.log("选中机构节点3")
                //  console.log(indeterminate)
            },
            qqk(val){
                val.CardPay = ""
                val.CashPay= ""
                val.Cost= ""
                val.Percent = ""
                val.VisitSum = ""
                val.SIPay = ""
                val.CardPayMZ = ""
                val.CashPayMZ = ""
                val.CostMZ = ""
                val.PercentMZ = ""
                val.VisitSumMZ = ""
                val.SIPayMZ= ""
                val.CardPayZY = ""
                val.CashPayZY = ""
                val.CostZY = ""
                val.PercentZY = ""
                val.VisitSumZY = ""
                val.SIPayZY = ""
            },
            getDataList() {
                if (this.tableData == null || this.tableData.length == 0) {
                    this.$message({showClose: true, message: "请选择机构后查询", type: "error"});
                    return
                }
                this.queryDataObj.Hospitals = [];
                this.tableData.forEach(m => {
                    this.queryDataObj.Hospitals.push(m.id);
                    this.qqk(m)
                    if (m.childs != null && m.childs.length > 0) {
                        m.childs.forEach(m1 => {
                            this.qqk(m1)
                            this.queryDataObj.Hospitals.push(m1.id);
                            if (m1.childs != null && m1.childs.length > 0) {
                                m1.childs.forEach(m2 => {
                                    this.qqk(m2)
                                    this.queryDataObj.Hospitals.push(m2.id);
                                    if (m2.childs != null && m2.childs.length > 0) {
                                        m2.childs.forEach(m3 => {
                                            this.qqk(m3)
                                            this.queryDataObj.Hospitals.push(m3.id);
                                            if (m3.childs != null && m3.childs.length > 0) {
                                                m3.childs.forEach(m4 => {
                                                    this.qqk(m4)
                                                    this.queryDataObj.Hospitals.push(m4.id);
                                                    if (m4.childs != null && m4.childs.length > 0) {
                                                        m4.childs.forEach(m5 => {
                                                            this.qqk(m5)
                                                            this.queryDataObj.Hospitals.push(m5.id);
                                                        })
                                                    }
                                                })
                                            }
                                        })
                                    }
                                })
                            }
                        })
                    }

                })

                var params = this.queryDataObj;
                console.log("请求查询传参");
                console.log(params);
                this.$post("/BI/getYBZT2List", params)
                    .then(res => {
                        console.log("请求查询返回值");
                        console.log(res.data);
                        if (res.code == 0) {
                            this.tableData22 = res.data;
                            // this.tableData22.forEach(m => {
                            //     if (!isNaN(m.Cost) && m.Cost !== '') {
                            //         // 截取当前数据到小数点后两位
                            //         m.Cost = parseFloat(m.Cost).toFixed(2)
                            //     } else {
                            //         // m.Cost = '0'
                            //     }
                            //     if (!isNaN(m.AvgCost) && m.AvgCost !== '') {
                            //         // 截取当前数据到小数点后两位
                            //         m.AvgCost = parseFloat(m.AvgCost).toFixed(2)
                            //     } else {
                            //         // m.Cost = '0'
                            //     }
                            // })

                            //组合数据
                            var Data = this.tableData
                            Data.forEach(m => {
                                this.tableData22.forEach(n => {
                                    if (m.id == n.HospitalId) {
                                        m.HospitalId = n.HospitalId
                                        m.CardPay = n.CardPay
                                        m.CashPay = n.CashPay
                                        m.Cost = n.Cost
                                        m.Percent = n.Percent
                                        m.VisitSum = n.VisitSum
                                        m.SIPay = n.SIPay
                                        if (n.MZ != null) {
                                            m.CardPayMZ = n.MZ.CardPay
                                            m.CashPayMZ = n.MZ.CashPay
                                            m.CostMZ = n.MZ.Cost
                                            m.PercentMZ = n.MZ.Percent
                                            m.VisitSumMZ = n.MZ.VisitSum
                                            m.SIPayMZ = n.MZ.SIPay
                                        }
                                        if (n.ZY != null) {
                                            m.CardPayZY = n.ZY.CardPay
                                            m.CashPayZY = n.ZY.CashPay
                                            m.CostZY = n.ZY.Cost
                                            m.PercentZY = n.ZY.Percent
                                            m.VisitSumZY = n.ZY.VisitSum
                                            m.SIPayZY = n.ZY.SIPay
                                        }
                                    }
                                })
                                if (m.childs != null && m.childs.length > 0) {
                                    m.childs.forEach(m1 => {
                                        this.tableData22.forEach(n => {
                                            if (m1.id == n.HospitalId) {
                                                m1.HospitalId = n.HospitalId
                                                m1.CardPay = n.CardPay
                                                m1.CashPay = n.CashPay
                                                m1.Cost = n.Cost
                                                m1.Percent = n.Percent
                                                m1.VisitSum = n.VisitSum
                                                m1.SIPay = n.SIPay
                                                if (n.MZ != null) {
                                                    m1.CardPayMZ = n.MZ.CardPay
                                                    m1.CashPayMZ = n.MZ.CashPay
                                                    m1.CostMZ = n.MZ.Cost
                                                    m1.PercentMZ = n.MZ.Percent
                                                    m1.VisitSumMZ = n.MZ.VisitSum
                                                    m1.SIPayMZ = n.MZ.SIPay
                                                }
                                                if (n.ZY != null) {
                                                    m1.CardPayZY = n.ZY.CardPay
                                                    m1.CashPayZY = n.ZY.CashPay
                                                    m1.CostZY = n.ZY.Cost
                                                    m1.PercentZY = n.ZY.Percent
                                                    m1.VisitSumZY = n.ZY.VisitSum
                                                    m1.SIPayZY = n.ZY.SIPay
                                                }
                                            }
                                        })
                                        if (m1.childs != null && m1.childs.length > 0) {
                                            m1.childs.forEach(m2 => {
                                                this.tableData22.forEach(n => {
                                                    if (m2.id == n.HospitalId) {
                                                        m2.HospitalId = n.HospitalId
                                                        m2.CardPay = n.CardPay
                                                        m2.CashPay = n.CashPay
                                                        m2.Cost = n.Cost
                                                        m2.Percent = n.Percent
                                                        m2.VisitSum = n.VisitSum
                                                        m2.SIPay = n.SIPay
                                                        if (n.MZ != null) {
                                                            m2.CardPayMZ = n.MZ.CardPay
                                                            m2.CashPayMZ = n.MZ.CashPay
                                                            m2.CostMZ = n.MZ.Cost
                                                            m2.PercentMZ = n.MZ.Percent
                                                            m2.VisitSumMZ = n.MZ.VisitSum
                                                            m2.SIPayMZ = n.MZ.SIPay
                                                        }
                                                        if (n.ZY != null) {
                                                            m2.CardPayZY = n.ZY.CardPay
                                                            m2.CashPayZY = n.ZY.CashPay
                                                            m2.CostZY = n.ZY.Cost
                                                            m2.PercentZY = n.ZY.Percent
                                                            m2.VisitSumZY = n.ZY.VisitSum
                                                            m2.SIPayZY = n.ZY.SIPay
                                                        }
                                                    }
                                                })
                                                if (m2.childs != null && m2.childs.length > 0) {
                                                    m2.childs.forEach(m3 => {
                                                        this.tableData22.forEach(n => {
                                                            if (m3.id == n.HospitalId) {
                                                                m3.HospitalId = n.HospitalId
                                                                m3.CardPay = n.CardPay//账号
                                                                m3.CashPay = n.CashPay//统筹
                                                                m3.Cost = n.Cost//合计
                                                                m3.Percent = n.Percent//百分比
                                                                m3.VisitSum = n.VisitSum//人次
                                                                m3.SIPay = n.SIPay//自付
                                                                if (n.MZ != null) {
                                                                    m3.CardPayMZ = n.MZ.CardPay
                                                                    m3.CashPayMZ = n.MZ.CashPay
                                                                    m3.CostMZ = n.MZ.Cost
                                                                    m3.PercentMZ = n.MZ.Percent
                                                                    m3.VisitSumMZ = n.MZ.VisitSum
                                                                    m3.SIPayMZ = n.MZ.SIPay
                                                                }
                                                                if (n.ZY != null) {
                                                                    m3.CardPayZY = n.ZY.CardPay
                                                                    m3.CashPayZY = n.ZY.CashPay
                                                                    m3.CostZY = n.ZY.Cost
                                                                    m3.PercentZY = n.ZY.Percent
                                                                    m3.VisitSumZY = n.ZY.VisitSum
                                                                    m3.SIPayZY = n.ZY.SIPay
                                                                }
                                                            }
                                                        })
                                                        if (m3.childs != null && m3.childs.length > 0) {
                                                            m3.childs.forEach(m4 => {
                                                                this.tableData22.forEach(n => {
                                                                    if (m4.id == n.HospitalId) {
                                                                        m4.HospitalId = n.HospitalId
                                                                        m4.CardPay = n.CardPay
                                                                        m4.CashPay = n.CashPay
                                                                        m4.Cost = n.Cost
                                                                        m4.Percent = n.Percent
                                                                        m4.VisitSum = n.VisitSum
                                                                        m4.SIPay = n.SIPay
                                                                        if (n.MZ != null) {
                                                                            m4.CardPayMZ = n.MZ.CardPay
                                                                            m4.CashPayMZ = n.MZ.CashPay
                                                                            m4.CostMZ = n.MZ.Cost
                                                                            m4.PercentMZ = n.MZ.Percent
                                                                            m4.VisitSumMZ = n.MZ.VisitSum
                                                                            m4.SIPayMZ = n.MZ.SIPay
                                                                        }
                                                                        if (n.ZY != null) {
                                                                            m4.CardPayZY = n.ZY.CardPay
                                                                            m4.CashPayZY = n.ZY.CashPay
                                                                            m4.CostZY = n.ZY.Cost
                                                                            m4.PercentZY = n.ZY.Percent
                                                                            m4.VisitSumZY = n.ZY.VisitSum
                                                                            m4.SIPayZY = n.ZY.SIPay
                                                                        }
                                                                    }
                                                                })
                                                                if (m4.childs != null && m4.childs.length > 0) {

                                                                }
                                                            })
                                                        }
                                                    })
                                                }
                                            })
                                        }
                                    })
                                }
                            })
                            this.tableDataList = Data

                            console.log("赋值后")
                            console.log(this.tableDataList)

                        } else {
                            this.$message({showClose: true, message: res.msg, type: "error"});
                        }
                    })
                    .catch(err => {
                        console.log(err);
                        this.$message({showClose: true, message: err, type: "error"});
                    });


            },
            getDataListItem(type,HospitalId) {
                var params ={
                    BeginDate:this.queryDataObj.BeginDate,
                    EndDate:this.queryDataObj.EndDate,
                    HospitalId:HospitalId,
                    Range:type
                } ;
                console.log("请求查询传参");
                console.log(params);
                this.$post("/BI/getYBZT2ListDetail", params)
                    .then(res => {
                        console.log("请求查询返回值");
                        console.log(res.data);
                        if (res.code == 0) {
                            this.tableDataListMX = res.data;
                        } else {
                            this.$message({showClose: true, message: res.msg, type: "error"});
                        }
                    })
                    .catch(err => {
                        console.log(err);
                        this.$message({showClose: true, message: err, type: "error"});
                    });


            },
            getSummaries(param) {
                console.log("计算合计")
                console.log(param)
                const {columns, data} = param;
                const sums = [];
                columns.forEach((column, index) => {
                    if (index === 0) {
                        sums[index] = '合计';
                        return;
                    }
                    var values1 = 0;
                    data.map(item => {
                        console.log("计算合计数据1@@@@@@@@@@@@@##########################")
                        console.log(item)
                        console.log("计算合计数据2@@@@@@@@@@@@@##########################")
                        console.log(column.property)
                        console.log("计算合计数据32@@@@@@@@@@@@@##########")
                        console.log(item[column.property])
                        if (item[column.property] != null && item[column.property] != "undefined" && item[column.property].valueOf() != null && item[column.property].valueOf() != 'undefined') {
                            values1 += parseFloat(item[column.property].valueOf())
                        }
                        if (item.childs != null && item.childs.length > 0) {
                            item.childs.forEach(m => {
                                if (m[column.property] != null && m[column.property] != "undefined" && m[column.property].valueOf() != null && m[column.property].valueOf() != 'undefined') {
                                    values1 += parseFloat(m[column.property].valueOf())
                                }
                                if (m.childs != null && m.childs.length > 0) {
                                    m.childs.forEach(m1 => {
                                        if (m1[column.property] != null && m1[column.property] != "undefined" && m1[column.property].valueOf() != null && m1[column.property].valueOf() != 'undefined') {
                                            values1 += parseFloat(m1[column.property].valueOf())
                                        }
                                        if (m1.childs != null && m1.childs.length > 0) {
                                            m1.childs.forEach(m2 => {
                                                if (m2[column.property] != null && m2[column.property] != "undefined" && m2[column.property].valueOf() != null && m2[column.property].valueOf() != 'undefined') {
                                                    values1 += parseFloat(m2[column.property].valueOf())
                                                }
                                                if (m2.childs != null && m2.childs.length > 0) {
                                                    m2.childs.forEach(m3 => {
                                                        if (m3[column.property] != null && m3[column.property] != "undefined" && m3[column.property].valueOf() != null && m3[column.property].valueOf() != 'undefined') {
                                                            values1 += parseFloat(m3[column.property].valueOf())
                                                        }
                                                        if (m3.childs != null && m3.childs.length > 0) {
                                                            m3.childs.forEach(m4 => {
                                                                if (m4[column.property] != null && m4[column.property] != "undefined" && m4[column.property].valueOf() != null && m4[column.property].valueOf() != 'undefined') {
                                                                    values1 += parseFloat(m4[column.property].valueOf())
                                                                }
                                                                if (m4.childs != null && m4.childs.length > 0) {
                                                                    m4.childs.forEach(m5 => {
                                                                        if (m5[column.property] != null && m5[column.property] != "undefined" && m5[column.property].valueOf() != null && m5[column.property].valueOf() != 'undefined') {
                                                                            values1 += parseFloat(m5[column.property].valueOf())
                                                                        }
                                                                    })
                                                                }
                                                            })
                                                        }
                                                    })
                                                }
                                            })
                                        }
                                    })
                                }
                            })
                        }
                    })
                    console.log("计算合计数据4@@@@@@@@@@@@@##########################")
                    console.log(values1)
                    var value = [];
                    value.push(values1)
                    const values = value
                    // const values = data.map(item => Number(item[column.property]));
                    console.log("计算合计数据")
                    console.log(values)
                    if (!values.every(value => isNaN(value))) {
                        sums[index] = values.reduce((prev, curr) => {
                            const value = Number(curr);
                            if (!isNaN(value)) {
                                return parseFloat(curr).toFixed(2).valueOf();
                                ;
                            } else {
                                return prev;
                            }
                        }, 0);
                        sums[index] += ' ';
                    } else {
                        sums[index] = 'N/A';
                    }
                });

                return sums;
            },
            init() {
                // this.getData();
                //
                var dom = document.getElementById("container");
                var myChart = echarts.init(dom);


                var dom4 = document.getElementById("container4");
                var myChart4 = echarts.init(dom4);


                //********************************************************************


                var dom7 = document.getElementById("container7");
                var myChart7 = echarts.init(dom7);


                //收入结构
                var optionQYYS = {
                    title: {
                        text: '收入结构(万元)',
                        subtext: '',
                        x: 'center'
                    },
                    tooltip: {
                        trigger: 'item',
                        formatter: "{a} <br/>{b} : {c} ({d}%)"
                    },
                    legend: {
                        orient: 'vertical',
                        left: 'left',
                        data: this.srjgKeys
                    },
                    series: [
                        {
                            name: '',
                            type: 'pie',
                            radius: '50%',
                            center: ['50%', '50%'],
                            data: this.srjgValues,
                            itemStyle: {
                                emphasis: {
                                    shadowBlur: 10,
                                    shadowOffsetX: 0,
                                    normal: {
                                        //颜色设置
                                        color: function (params) {
                                            let colorList = [
                                                "#4BABDE",
                                                "#FFDE76",
                                                "#E43C59",
                                                "#61a0a8",
                                                "#d48265",
                                                "#91c7ae",
                                                "#749f83",
                                                "#c23531",
                                                "#2f4554",
                                                "#ca8622",
                                                "#bda29a",
                                                "#6e7074",
                                                "#546570",
                                                "#c4ccd3",

                                                "#37A2DA"
                                            ];
                                            return colorList[params.dataIndex];
                                        }
                                    }
                                }
                            }
                        }
                    ]
                };
                myChart.setOption(optionQYYS, true);//收入结构


                //*********************第二行****************************
                //全院预算执行进度
                var optionHZFD = {
                    title: {
                        text: '病人费用统计',
                        subtext: ''
                    },
                    tooltip: {
                        trigger: 'axis'
                    },
                    legend: {
                        data: ['次均门诊费用（元）', '次均住院费用（百元）']
                    },
                    calculable: true,
                    xAxis: [
                        {
                            type: 'category',
                            boundaryGap: false,
                            data: this.BRFYtimeList
                        }
                    ],
                    yAxis: [
                        {
                            type: 'value',
                            axisLabel: {
                                formatter: '{value} '
                            }
                        }
                    ],
                    series: [
                        {
                            name: '次均门诊费用（元）',
                            type: 'line',
                            data: this.BRFYmzDate,
                            markLine: {
                                data: [
                                    {type: 'average', name: '平均值'}
                                ]
                            }
                        },
                        {
                            name: '次均住院费用（百元）',
                            type: 'line',
                            data: this.BRFYzyDate,

                            markLine: {
                                data: [
                                    {type: 'average', name: '平均值'}
                                ]
                            }
                        }
                    ]
                };
                myChart7.setOption(optionHZFD, true);

                //业务收入
                var optionYWSR = {
                    title: {
                        text: '月收入统计',
                        subtext: ''
                    },
                    tooltip: {
                        trigger: 'axis'
                    },
                    legend: {
                        data: ['业务收入（万元）', '药品收入（万元）']
                    },
                    calculable: true,
                    xAxis: [
                        {
                            type: 'category',
                            data: this.YSRtimeList
                        }
                    ],
                    yAxis: [
                        {
                            type: 'value'
                        }
                    ],
                    series: [
                        {
                            name: '业务收入',
                            type: 'bar',
                            data: this.YSRzlDate,
                            markPoint: {
                                data: [
                                    {type: 'max', name: '最大值'},
                                    {type: 'min', name: '最小值'}
                                ]
                            },
                            markLine: {
                                data: [
                                    {type: 'average', name: '平均值'}
                                ]
                            }
                        },
                        {
                            name: '药品收入',
                            type: 'bar',
                            data: this.YSRypDate,
                            markPoint: {
                                data: [
                                    // {name: '最大值', value: 182.2, xAxis: 7, yAxis: 183, symbolSize: 18},
                                    // {name: '最小值', value: 2.3, xAxis: 11, yAxis: 3}
                                    {type: 'max', name: '最大值'},
                                    {type: 'min', name: '最小值'}
                                ]
                            },
                            markLine: {
                                data: [
                                    {type: 'average', name: '平均值'}
                                ]
                            }
                        }
                    ]
                };
                myChart4.setOption(optionYWSR, true);

            },//界面加载完成后执行
            formatDateTime(date, dt) {
                var nd = date
                nd = nd.valueOf()
                nd = nd + dt * 24 * 60 * 60 * 1000
                nd = new Date(nd)
                var y = nd.getFullYear()// 获取年
                var m = nd.getMonth() + 1// 获取月
                var d = nd.getDate()// 获取天
                var h = nd.getHours()// 获取小时
                var f = nd.getMinutes()// 获取分钟
                var s = nd.getSeconds()// 获取秒
                if (m <= 9) m = '0' + m
                if (d <= 9) d = '0' + d
                if (h <= 9) h = '0' + h
                if (f <= 9) f = '0' + f
                if (s <= 9) s = '0' + s
                // var cdate = y + '-'  + m +  '-'  + d + ' '  + h +  ':'  + f +  ':'  + s;
                var cdate = y + '-' + m + '-' + d
                return cdate

            },
        },
        beforeDestroy() {
            // 由于window.onresize是全局事件，在其他页面改变界面时也会执行，这样可能会出现问题，需要在离开这个界面时注销window.onresize事件
            window.onresize = null
        },
        mounted() {
            this.init();
            this.$nextTick(() => {
                this.setTableHeight()
                // 监听窗口大小变化
                window.onresize = () => {
                    this.setTableHeight()
                }
            })
        },
        watch: {
            selectZZJGNames: {
                handler(newVal, objVal) {
                    console.log("触发改变%%%%%%%%%%%%%%%%%%%55")
                    this.showTooltip()
                    this.getDataList()
                },
            }
        },
        created() {
            this.msg = this.$route.query;
            console.log("接收过来的传参#############################################################################")
            console.log(this.msg)
            if (this.msg.Token != null && this.msg.Token != "") {
                console.log("设置Token")
                this.$setToken(this.msg.Token)
                this.$setItemUrl(this.msg.ItemIP)
                var loginInfor = this.msg.loginInfor;
                this.LoginInfor = JSON.parse(loginInfor);
                console.log("个人登录信息");
                console.log(this.LoginInfor);

            } else {
                console.log("Token为空")
                var loginInfor = localStorage.getItem('LoginInfor');
                this.LoginInfor = JSON.parse(loginInfor);
                console.log("个人登录信息");
                console.log(this.LoginInfor);
                if (this.LoginInfor == null) {
                    this.LoginInfor = {
                        SectionName: "",
                        UserName: ""
                    }
                }
            }
            console.log("获取机构代码………………………………………………………………………………")
            this.ZZJGList = []
            this.ZZJGList.push(this.LoginInfor.HospitalTree)
            console.log(this.ZZJGList);

            if (this.ZZJGList.length > 0) {
                this.selectZZJGNames = this.LoginInfor.HospitalName + ","
                var obj = {
                    id: this.LoginInfor.HospitalId,
                    name: this.LoginInfor.HospitalName
                }
                this.selectZZJGIDList.push(obj)
                // this.$refs.treeJG.setCheckedKeys([obj.id]);
            }
            this.tableData = this.ZZJGList


            this.queryDataObj.BeginDate = this.formatDateTime(new Date(), -10); //挂号日期
            this.queryDataObj.EndDate = this.formatDateTime(new Date(), 0); //挂号日期
            this.setTableHeight()
        }
    };
</script>
<style lang="scss">
    .NumbeRFMaintenMZZJJZ {
        .el-table td, .el-table th {
            padding: 8px 0 !important;
        }

        .el-table {
            font-size: 12px !important;
        }

        .selectTime {
            .el-input__icon {
                height: 100%;
                width: 25px;
                display: none;
                text-align: center;
                -webkit-transition: all .3s;
                transition: all .3s;
                line-height: 40px;
            }

            .input {
                width: 90px !important;
                height: 28px !important;
            }


        }

        .ypList {
            .el-input__inner {
                height: 20px !important;
                padding: 0 0 0 15px !important;
            }

            .el-input__inner {
                -webkit-appearance: none;
                background-color: #FFF;
                background-image: none;
                border-radius: 4px;
                border: 1px solid #DCDFE6;
                -webkit-box-sizing: border-box;
                box-sizing: border-box;
                color: #606266;
                display: inline-block;
                font-size: 10px !important;
                height: 40px;
                line-height: 40px;

                -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
                transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
                width: 100%;
            }

            .el-autocomplete-suggestion li {
                padding: 0px 6px !important;
                margin: 0;
                line-height: 34px;
                cursor: pointer;
                color: #606266;
                font-size: 10px !important;
                list-style: none;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
        }

        .selectPic {
            ul {
                padding: 0;
                display: none;
            }
        }

        .camera_outer {
            position: relative;
            overflow: hidden;
            background: #0a1015;
            background-size: 100%;

            video, canvas, .tx_img {
                -moz-transform: scaleX(-1);
                -webkit-transform: scaleX(-1);
                -o-transform: scaleX(-1);
                transform: scaleX(-1);
            }

            .btn_camera {
                position: absolute;
                bottom: 4px;
                left: 0;
                right: 0;
                height: 50px;
                background-color: rgba(0, 0, 0, 0.3);
                line-height: 50px;
                text-align: center;
                color: #ffffff;
            }

            .bg_r_img {
                position: absolute;
                bottom: 0;
                left: 0;
                right: 0;
                top: 0;
            }

            .img_bg_camera {
                position: absolute;
                bottom: 0;
                left: 0;
                right: 0;
                top: 0;

                img {
                    width: 100%;
                    height: 100%;
                }

                .img_btn_camera {
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    right: 0;
                    height: 50px;
                    line-height: 50px;
                    text-align: center;
                    background-color: rgba(0, 0, 0, 0.3);
                    color: #ffffff;

                    .loding_img {
                        width: 50px;
                        height: 50px;
                    }
                }
            }
        }

        .Dilog {
            .column2 {
                width: 128rem;
                margin: 50px auto;
                background: #fff;
                border-radius: 5px;
                position: relative;
            }

            .form-control {
                width: 96px !important;
            }
        }

        .DilogYP {
            .column2 {
                width: 680px;
                margin: 50px auto;
                background: #fff;
                border-radius: 5px;
                position: relative;
            }

            .form-control {
                width: 96px !important;
            }
        }

        .div_P {
            .form-control {
                display: inline-block;
                width: 12rem;
                height: 32px;
                padding: 5px 12px;
                font-size: 14px;
                line-height: 1.42857143;
                color: #555;
                background-color: #fff;
                background-image: none;
                border: 1px solid #ccc;
                border-radius: 4px;
                -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
                box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
                -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
                transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
                transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
                transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
            }

            .form-group {
                height: 45px;
                margin: 0;
                line-height: 32px;
                padding: 6px 15px 0 15px;
            }
        }

        .elRadioYygh {
            .column2 label {
                width: 52px !important;
            }

            .el-radio-button__inner {

                padding: 6px 11px;

            }
        }

        .fjtable {
            .el-table {
                font-size: 10px !important;
            }
        }

        .cardP {
            .text {
                font-size: 14px;
            }

            .el-card__header {
                padding: 18px 20px;
                border-bottom: 1px solid #EBEEF5;
                -webkit-box-sizing: border-box;
                box-sizing: border-box;
                background-color: azure;
            }

            .item {
                margin-bottom: 18px;
            }

            .clearfix:before,
            .clearfix:after {
                display: table;
                content: "";
            }

            .clearfix:after {
                clear: both
            }

            .box-card {
                width: 100%;
            }
        }

        .cardPdd {
            .text {
                font-size: 14px;
            }

            .el-card__header {
                padding: 18px 20px;
                border-bottom: 1px solid #EBEEF5;
                -webkit-box-sizing: border-box;
                box-sizing: border-box;
                background-color: azure;
            }

            .item {
                margin-bottom: 18px;
            }

            .clearfix:before,
            .clearfix:after {
                display: table;
                content: "";
            }

            .clearfix:after {
                clear: both
            }

            .box-card {
                width: 100%;
            }

            .el-card__body {
                padding: 2px;
            }
        }

        .cardPD {
            .text {
                font-size: 12px;
            }

            .el-card__header {
                padding: 8px 20px;
                border-bottom: 1px solid #EBEEF5;
                -webkit-box-sizing: border-box;
                box-sizing: border-box;
                background-color: azure;
            }

            .item {
                margin-bottom: 18px;
            }

            .clearfix:before,
            .clearfix:after {
                display: table;
                content: "";
            }

            .clearfix:after {
                clear: both
            }

            .box-card {
                width: 100%;
            }
        }

        .cardC {
            .text {
                font-size: 14px;
            }

            .el-card__header {
                padding: 10px 20px;
                border-bottom: 1px solid #EBEEF5;
                -webkit-box-sizing: border-box;
                box-sizing: border-box;
                background-color: white;
            }

            .el-card__body {
                padding: 8px;
            }

            .item {
                margin-bottom: 18px;
            }

            .clearfix:before,
            .clearfix:after {
                display: table;
                content: "";
            }

            .clearfix:after {
                clear: both
            }

            .box-card {
                width: 100%;
            }
        }


        .el-tree-node.is-current > .el-tree-node__content {
            color: #fff;
            background: #155a00 !important;
        }

        .dRightMain {
            padding: 18px;
        }

        .custom-tree-node {
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: space-between;
            font-size: 14px;
            padding-right: 8px;
        }

        .el-table thead {
            color: #303133;
        }

        .dRightMain .Tb {
            position: absolute;
            top: 91px;
            left: 240px;
            right: 15px;
            bottom: 0;
            border: 1px solid #ddd;
        }
    }

</style>
